﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="ListBoxTest.aspx.cs" Inherits="TheardLearnWeb.ListBoxTest" EnableEventValidation="false" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>ListBox</title>
    <script type="text/javascript">
        Array.prototype.indexOf = function (val) {
            for (var i = 0; i < this.length; i++) {
                if (this[i] == val) return i;
            }
            return -1;
        };

        Array.prototype.remove = function (val) {
            var index = this.indexOf(val);
            if (index > -1) {
                this.splice(index, 1);
            }
        };

        var arr = [];

        function change(){      
            var addOption=document.createElement("option");      
            var index1;      
            //if(document.form1.list_Client.length==0)
            //    return (false);
            if (document.getElementById("<%=list_Client.ClientID%>") == null)
                return (false);

            //index1 = document.form1.list_Client.selectedIndex;
            index1 = document.getElementById("<%=list_Client.ClientID%>").selectedIndex;
            if(index1<0)
                return (false);

            //addOption.text = document.form1.list_Client.options(index1).text;
            addOption.text = document.getElementById("<%=list_Client.ClientID%>").options[index1].text;

            //addOption.value=document.form1.list_Client.value;     
            addOption.value = document.getElementById("<%=list_Client.ClientID%>").options[index1].value;

            //document.form1.list_Client2.add(addOption);   
            document.getElementById("<%=list_Client2.ClientID%>").options.add(addOption);

            //document.form1.list_Client.remove (index1);     
            document.getElementById("<%=list_Client.ClientID%>").options.remove(index1);

            document.getElementById("<%=hidcontent.ClientID%>").value = "1";
        }

        function leftchange(){
            var addOption = document.createElement("option");
            var index1;
           
            if (document.getElementById("<%=list_Client.ClientID%>") == null)
                return (false);
            
            index1 = document.getElementById("<%=list_Client.ClientID%>").selectedIndex;
            if (index1 < 0)
                return (false);
            
            addOption.text = document.getElementById("<%=list_Client.ClientID%>").options[index1].text;
            addOption.value = document.getElementById("<%=list_Client.ClientID%>").options[index1].value;

            document.getElementById("<%=list_Client2.ClientID%>").options.add(addOption);
            document.getElementById("<%=list_Client.ClientID%>").options.remove(index1);

            arr.push(addOption.text);

           
        }

        function rightchange() {
            var addOption = document.createElement("option");
            var index1;

            if (document.getElementById("<%=list_Client2.ClientID%>") == null)
                return (false);

            index1 = document.getElementById("<%=list_Client2.ClientID%>").selectedIndex;
            if (index1 < 0)
                return (false);

            addOption.text = document.getElementById("<%=list_Client2.ClientID%>").options[index1].text;
            addOption.value = document.getElementById("<%=list_Client2.ClientID%>").options[index1].value;

            document.getElementById("<%=list_Client.ClientID%>").options.add(addOption);
            document.getElementById("<%=list_Client2.ClientID%>").options.remove(index1);

            arr.remove(addOption.text);
        }

        function getValue() {
            var content="";
            for (var i = 0; i < arr.length; i++) {
                if (i == arr.length - 1)
                    content += arr[i];
                else
                    content += arr[i] + ";";
            }
            document.getElementById("<%=hidcontent.ClientID%>").value = content;
        }
</script>
</head>
<body>
    <form id="form1" runat="server">
        <asp:ScriptManager ID="ScriptManager1" runat="server" AllowCustomErrorsRedirect="true">  
        </asp:ScriptManager>

       <asp:ListBox ID="list_Client" runat="server" Width="240" Height="300"></asp:ListBox>

　　 >>
       <asp:ListBox ID="list_Client2" runat="server" Width="240" Height="300"></asp:ListBox>
        <asp:Button ID="Button1" runat="server" Text="Button" OnClientClick="getValue();" OnClick="Button1_Click"  />
        <input type="hidden" id="hidcontent" runat="server" />

        <asp:UpdatePanel ID="UpdatePanel1" runat="server">  
            <ContentTemplate>  
                <asp:DropDownList ID="DropDownList1" runat="server" AutoPostBack="true">
                    <asp:ListItem>a</asp:ListItem>
                    <asp:ListItem>b</asp:ListItem>
                </asp:DropDownList>
            </ContentTemplate>  
        </asp:UpdatePanel>  
    </form>
</body>

</html>
